<template>
	<view class="nav-bar" :style="{paddingTop: statusBarHeight+'rpx'}">
		<view class="bar" :style="{height: `${barHeight}rpx`,backgroundColor: 'red'}">
			<view>{{barHeight}}{{statusBarHeight}}</view>
		</view>
	</view>
</template>

<script>
	import {mapGetters} from 'vuex'
	export default {
		data(){
			return {
			}
		},
		computed: {
			...mapGetters({
				statusBarHeight: 'system/statusBarHeight',
				barHeight: 'system/barHeight'
			})
		},
		mounted(){
			console.log(this.barHeight)
		},
		methods: {
			// 获取设备窗口信息
			getWindowInfo(){
				const res = uni.getWindowInfo()
				// console.log(res)
			},
		}
	}
</script>

<style lang="less" scoped>
	.nav-bar{
		.bar{
			display: flex;
			align-items: center;
		}
	}
</style>